<template>
	<view :data-theme="theme">
		<view class="record-card">
			<view class="card-title" v-for="(item,index) in judgeLogsData" :key="index">
				<view class="card-content"
					style="font-size: 24rpx;margin: 20rpx 0;align-items: center;text-align: center;position: relative;">
					<span
						style="font-size: 30px;position: absolute;top: -10px;">.</span><span
						style="margin-left: 20rpx;">{{item.createTime}}</span>
				</view>
				<view style="background-color: #fff;padding: 20rpx;">
					<view class="title-top" style="display: flex;font-weight: bold;margin: 10rpx 0;">
						<view class="text-left" style="flex: 1;">
							{{item.roleName}}
						</view>
						<view class="text-right" style="flex: 3;color: #274fbb;">
							{{item.roleId == 0 ?'判责':'申诉'}}
						</view>
					</view>
					<view class="card-content">
						<view class="content_left">
							{{item.roleId == 0 ?'判责责任方:':'申诉描述:'}}
						</view>
						<view class="content_right">
							{{item.param1?item.param1:' '}}
						</view>
					</view>
					<view class="card-content">
						<view class="content_left">
							{{item.roleId == 0 ?'判责说明:':'申诉原因:'}}
						</view>
						<view class="content_right">
							{{item.param2?item.param2:' '}}
						</view>
					</view>
					<view class="card-content" v-if="item.roleId != 0">
						<view class="content_left">
							申诉凭证:
						</view>
						<view class="content_right">
							{{item.param3}}
						</view>
					</view>
				</view>

			</view>
		</view>
	</view>
</template>

<script>
	import {
		afterSaleLogsApi
	} from '@/api/aftermarket.js';
	import {
		setThemeColor
	} from '@/utils/setTheme';
	let app = getApp();
	export default {
		data() {
			return {
				bgColor: "#ffffff",
				theme: app.globalData.them,
				orderId: '',
				judgeLogsData: [],
			};
		},
		onLoad(options) {
			this.bgColor = setThemeColor();
			uni.setNavigationBarColor({
				frontColor: '#ffffff',
				backgroundColor: this.bgColor,
			});
			this.orderId = options.orderId;
		},
		mounted() {
			this.afterSaleLogs();
		},
		methods: {
			afterSaleLogs() {
				afterSaleLogsApi({
					orderId: this.orderId
				}).then((res) => {
					console.log('res:', res);
					this.judgeLogsData = res.data;
				})
			},
		}
	}
</script>

<style lang="scss">
	.record-card {
		margin: 10rpx;
		padding: 20rpx;
	}

	.card-title {
		// padding: 20rpx;
		// background-color: #fff;
		margin: 20rpx 0;


	}

	.card-content {
		display: flex;

		.content_left {
			flex: 1;
		}

		.content_right {
			flex: 3;
		}
	}
</style>